<template>
	<view>
		<pageHeader @back='back' :fixed='true'>
			<text>预览详情</text>
		</pageHeader>
		<swiper class="swiper"  circular>
			<swiper-item v-for="(item,index) in imgPathList" :key='index'>
				<view class="banner_img">
					<image :src="item" mode="aspectFill"  ></image>
					<text>{{index+1}}/{{imgPathList.length}}</text>
				</view>
			</swiper-item>
		</swiper>
		<view class="author_message">
			<image :src="userMessage.headPicture?userMessage.headPicture:'/static/img/toux2x.png'" mode=""></image>
			<view >
				<text>{{userMessage.username?userMessage.username:userMessage.nickname}}</text>
				<text class="time">{{time_day}} {{time_hour}}</text>
			</view>
		</view>
		<text class="title" v-if="title">{{title}}</text>
		<text class="content"  v-if="content">{{content}}</text>
		<view class="products">
			<productLink :width='linkList.length>1?"636rpx":"690rpx"' v-for="(item,index) in linkList" :key='index'  :isNeedDele='false' :backgroundColor='"#F4F4F4"' :message='item' />
			<view style="width:1rpx;min-width: 1rpx;"></view>
		</view>
		<view style="height: 1rpx;background-color: #EEEEEE;width: 690rpx;margin-left: 30rpx;margin-top: 30rpx"></view>
		<view style="height:98rpx;margin-top: 30rpx"></view>
		<view class="add_button" @tap="toAdd">
			<text>发布</text>
		</view>
	</view>
</template>

<script>
	import url from '@/common/util/personal.js'
	import urls from "@/common/util/homeArtIndex.js"
	import pageHeader from "@/components/header/header.vue"
	import productLink from "@/components/ReleaseFineArt/productLink.vue"
	export default {
		components: {pageHeader,productLink},
		data() {
			return {
				imgPathList:[],
				linkList:[],
				title:"",
				content:"",
				time_day:"",
				time_hour:"",
				isEdit:false,
				id:"",
				userMessage:{}
			};
		},
		onLoad(e) {
			if(e.isEdit){
				this.isEdit=true
				this.id=e.id
			}
			let date=new Date()
			let y=date.getFullYear()
			let m=date.getMonth() +1
			m=(m<10?("0"+m):m)
			let d=date.getDate()
			d=(d<10?("0"+d):d)
			let h=date.getHours()
			h=(h<10?("0"+h):h)
			let mm=date.getMinutes()
			mm=(mm<10?("0"+mm):mm)
			this.time_day=y+'-'+m+'-'+d
			this.time_hour=h+':'+mm
			this.getMessage()
			this.getuser()
		},
		methods: {
			async getuser(){
				let res=await url.getDesignerInfo({userId:localStorage.getItem("userId")})
				this.userMessage=res.data
			},
			getMessage(){
				let message=JSON.parse(localStorage.getItem("releaseFineArtMessage"))
				this.title=message.title?message.title:""
				this.content=message.content?message.content:!message.title?"分享图片":""
				this.imgPathList=message.imgPathList?message.imgPathList:[]
				this.linkList=message.linkList?message.linkList:[]
			},
			back() {
				uni.navigateBack({
					delta: 1
				})
			},
			async toAdd(){
				let message=JSON.parse(localStorage.getItem("releaseFineArtMessage"))
				let data={}
				data.fineTitle=message.title
				data.fineContent=message.content?message.content:!message.title?"分享图片":""
				data.fineImage=message.imgPathList.join(',')
				data.userId=localStorage.getItem("userId")
				data.list=JSON.stringify(message.linkList)
				data.draft=1
				uni.showLoading({
					mask: true
				})
				let res
				if(this.isEdit){
					data.shopId=""
					data.fineId=this.id
					res=await urls.updatefineArt(data)
				}else{
					res=await urls.insertFineArt(data)
				}
				uni.hideLoading()
				if(res.code==0){
					localStorage.removeItem("releaseFineArtMessage")
					uni.showToast({
					    title: '发布成功',
					    duration: 1500
					})
					setTimeout(()=>{
						uni.navigateBack({
							delta: 2
						})
					},1500)
				}
			}
		},
	}
</script>

<style lang="scss">
.swiper{
	height: 750rpx;
	width: 750rpx;
}
.banner_img{
	height: 750rpx;
	width: 750rpx;
	position: relative;
	image{
		height: 100%;
		width: 100%;
		display: block;
	}
	text{
		display: block;
		position: absolute;
		bottom: 16rpx;
		right: 16rpx;
		height: 40rpx;
		padding: 0 18rpx;
		background-color: #C1AF99;
		border-radius: 22rpx;
		line-height:40rpx ;
		color: #FFFFFF;
		font-size: 24rpx;
		letter-spacing: 1rpx;
	}
}
.author_message{
	margin-top:30rpx;
	padding-left: 30rpx;
	display: flex;
	align-items: center;
	image{
		height: 80rpx;
		width: 80rpx;
		border-radius: 50%;
	}
	view{
		height: 80rpx;
		display: flex;
		flex-flow: column;
		justify-content: space-between;
		margin-left: 16rpx;
		text{
			font-size: 30rpx;
			color: #333333;
			font-weight: bold;
			position: relative;
			top: 6rpx;
			line-height: 30rpx;
			letter-spacing: 1rpx;
		}
		.time{
			font-size: 24rpx;
			color: #999999;
			line-height: 24rpx;
			font-weight: normal;
			top: unset;
			bottom: 6rpx;
		}
	}
}
.title{
	font-size: 32rpx;
	line-height: 36rpx;
	letter-spacing: 2rpx;
	color: #333333;
	font-weight: bold;
	display: inline-block;
	margin: 30rpx 30rpx 0;
}
.content{
	display: inline-block;
	font-size: 28rpx;
	letter-spacing: 2rpx;
	color: #333333;
	line-height: 42rpx;
	margin: 30rpx 30rpx 0;
	width: 690rpx;
	text-align: justify;
}
.products{
	display: flex;
	padding: 0 30rpx 0;
	width: 750rpx;
	overflow-x: auto;
	overflow-y: hidden;
	flex-wrap: nowrap;
	view{
		min-width:636rpx ;
	}
}
.add_button{
	height: 98rpx;
	width: 750rpx;
	position: fixed;
	bottom: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #C84739;
	text{
		font-size: 34rpx;
		letter-spacing: 1rpx;
		color: #FFFFFF;
	}
}
</style>
